import { Component } from '@angular/core';
import { trigger, state, style, animate, transition } from '@angular/animations';
import { log } from 'util';

@Component({
  selector: 'app-directive-anime',
  templateUrl: './directive-anime.component.html',
  styleUrls: ['./directive-anime.component.scss'],
})
export class DirectiveAnimeComponent {
  isOpen = false;
  showForm = false;
  type = true;

  private formList: any[] = [
    { index: 1, show: false },
    { index: 2, show: false },
  ];

  toggle() {
    this.isOpen = !this.isOpen;
  }

  onBtnClick(index: number) {
    this.type = !this.type;
    this.isOpen = !this.isOpen;
    this.formList.forEach((item) => {
      item.show = item.index === index ? true : false;
    });
    this.showForm = true;
  }
}
